@tailwind base;
@tailwind components;
@tailwind utilities;

// 自定义的一些颜色样式，全局样式,!important声明优先级高于其他样式
:root {
  --el-color-primary: #34d399 !important;
  --el-color-primary-light-1: #065f46 !important;
  --el-color-primary-light-2: #047857 !important;
  --el-color-primary-light-3: #059669 !important;
  --el-color-primary-light-4: #10b981 !important;
  --el-color-primary-light-5: #34d399 !important;
  --el-color-primary-light-6: #6ee7b7 !important;
  --el-color-primary-light-7: #a7f3d0 !important;
  --el-color-primary-light-8: #d1fae5 !important;
  --el-color-primary-light-9: #ecfdf5 !important;
  --el-color-primary-dark-2: #337ecc !important;
  --el-text-color-primary: text-slate-700;
}

//检测用户系统是否启用了暗色主题。其中的CSS规则将应用于匹配的元素
html.dark {
  --el-color-primary: #059669 !important;
  --el-color-primary-light-9: #57534e !important;
  --el-border-color-base: #57534e !important;
  --el-text-color-regular: #e2e8f0 !important;
  --el-text-color-primary: text-slate-200 !important;
  --el-bg-color: #474648 !important;
  --el-color-white: #1e1e1f !important;
  --el-border-color-lighter: #474648 !important;
  --el-border-color-light: #474648 !important;
  --el-popover-bg-color: #292524 !important;
}

//全局样式
body {
  // 字体系列按照给定的顺序进行优先级匹配
  font-family: Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial,
    sans-serif;
  //字体颜色，字体背景
  @apply text-slate-700 bg-white;
  //系统启用暗色主题时，会应用这些样式，对应@media
  @apply dark:bg-[#1e1e1f] dark:text-slate-100;
}
